import React, { useEffect, useState } from 'react'
import { getRecordDetail } from "../../../../api/myRecord"
import {Button} from "antd"
import "./index.scss"
export default function DetailRecord(props) {
    const [obj, setObj] = useState({})
    const getid = async() => {
        let res = await getRecordDetail(props.match.params.id)
        setObj(res.data.data)
    }
    useEffect(async () => {
        getid()
    }, [props])
    return (
        <div className="detailRecord">
            <h1><span>查看面试记录</span><Button onClick={()=>{
                props.history.goBack()
            }}>返回</Button></h1>
            <div>
                <span><b>岗位名称</b><span>{obj.stationName}</span></span>
                <span><b>公司名称</b><span>{obj.companyName}</span></span>
            </div>
            <div>
                <span><b>面试时间</b><span>{obj.interviewTime}</span></span>
                <span><b>时长</b><span>{obj.duration ? obj.duration : "未知"}</span></span>
            </div>
            <div>
                <span><b>地点</b><span>{obj.site}</span></span>
                <span><b>面试官</b><span>{obj.intervierManagement}</span></span>
            </div>
            <div>
                <span><b>专业</b><span>{obj.majorName}</span></span>
                <span><b>提交人</b><span>{obj.commitName}</span></span>
            </div>
            <div>
                <span><b>记录吐槽</b><span>{obj.record}</span></span>
            </div>
            <div>
                <span><b>面试结果</b><span>{obj.status === 0 ? "不确定" : obj.status === 1 ? "通过" : "未通过"}</span></span>
                <span><b>录音文件</b><span>{obj.issoundrecord === 0 ? "无" : "有"}</span></span>
            </div>
            <div>
                <div className="problem">
                    <b>面试问题</b>
                    <div>
                        {
                            obj.askAndanswerList&&obj.askAndanswerList.length ? obj.askAndanswerList.map((item, index) => {
                                return <>
                                    <div className="answers">
                                        <span className="questionspan">问</span>
                                        <span>{item.question}</span>
                                    </div>
                                    <div className="answers">
                                        <span className="answerspan">答</span>
                                        <span>{item.answer ? item.answer : "没有设置答案"}</span>
                                    </div>
                                    
                                </>
                            }) : <span>没有设置面试问题哦</span>
                        }
                    </div>
                </div>
            </div>
        </div>
    )
}
